<template>
  <div @click="fn1">
    <!-- 阻止冒泡 -->
    <button @click.stop="fn">点我呀</button>
    <!-- 阻止默认跳转 -->
    <a @click.prevent="fn2" href="http://www.baidu.com">百度</a>
    <!-- 只能点一次,点完一次就不生效了 -->
    <button @click.once="fn3">点击</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      
    }
  },
  methods: {
    fn(){
      console.log('子元素')
    },
    fn1(){
      console.log('父元素');
    },
    fn2(){

    },
    fn3(){
      console.log('一次');
    }
 }, 

}
</script>